<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>一键判题</title>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <link rel="stylesheet" href="css/bootstrap.css">
    <style>
        /*导航栏样式*/
        .navbar {
            background-color: #222;
        }
        #daohang {
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: hidden;
            background-color: transparent;
        }
        li {
            float: left;
        }
        li a {
            display: block;
            color: white;
            text-align: center;
            padding: 14px 16px;
            text-decoration: none;
        }

        .dropbtn {
            background-color: transparent;
            color: white;
            padding-left: 35px;
            padding-right: 35px;
            font-size: 16px;
            border: none;
            cursor: pointer;
        }

        .dropdown {
            position: relative;
            display: inline-block;
            text-align: center;
        }

        .dropdown-content {
            display: none;
            position: absolute;
            background-color: #f9f9f9;
            width: 100%;;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        }

        .dropdown-content a {
            color: black;
            padding: 12px 16px;
            text-decoration: none;
            display: block;
        }

        .dropdown-content a:hover {
            background-color: #f1f1f1
        }

        .dropdown:hover .dropdown-content {
            display: block;
        }

        .dropdown:hover .dropbtn {
            background-color: transparent;
        }
        .odd
        {
            background-color: #f5f5f5;
        }
        .even
        {
            background-color: red;
        }
    </style>
</head>
<body>
<nav class="navbar navbar-expand-md navbar-dark fixed-top sticky-navigation">
    <a class="navbar-brand font-weight-bold" href="manager.html">我的OJ平台</a>
    <div class="collapse navbar-collapse" id="topMenu">
        <ul class="navbar-nav ml-auto" >
            <div style="margin:5px" id="javaoj">
                <a style="color: white" href="login.html" onclick="logout()"> 退出登录</a>
                <div class="dropdown">
                    <button class="dropbtn">设置</button>
                    <div class="dropdown-content">
                        <a href="updateInfo.html">修改个人信息</a>
                        <a href="updatePassword.html">修改密码</a>
                    </div>
                </div>
            </div>
        </ul>
    </div>
</nav>
<section class="my-5 pt-5">
    <div class="container">
        <!-- Tables  -->
        <div class="row mb-5" id="tables">
            <div class="col-sm-12" style="background-color: white">
                <div class="mt-3 mb-5">
                    <h3 style="align: center">判题列表</h3>
                    <table class="table table-striped" id="shareContent" style="background-color: white">
                        <tr><th>题号</th><th>学号</th><th>成绩</th></tr>
                    </table>
                </div>
            </div>
        </div>
    </div>
</section>
<script>
    // 解析地址，获取questionId参数
    function getQueryString(value) {
        const reg = new RegExp("(^|&)" + value + "=([^&]*)(&|$)", "i");
        const r = window.location.search.substr(1).match(reg);
        if (r != null) return unescape(r[2]); return null;
    }
    // const questionId = getQueryString("questionId");

    const questionId=localStorage.getItem("questionId");
    $(document).ready(function(){
        $.ajax({
            url:"http://192.168.47.129:8010/admin/autoJudgeQuestion/"+questionId,
            // url:"http://localhost:8020/question/queryQuestionList ",
            //data是返回值 所有数据
            success:function (object) {
                console.log(object);
                // let array=object.data;
                let array=object.data;
                console.log(array);
                for (let i=0; i<array.length; i++) {
                    // console.log(array[i].questionId);
                    // console.log(array[i].userId);
                    // console.log(array[i].mark);
                    if (i%2 == 0) {
                        $(".table").append("<tr style='background: #f5f5f5;'>\n" +
                            "<td>" + array[i].questionId + "</td>\n" +
                            "<td>" + array[i].userId + "</td>\n" +
                            "<td>" + array[i].mark + "</td>\n" +
                            "</tr>\n");
                    } else {
                        $(".table").append("<tr>\n" +
                            "<td>" + array[i].questionId + "</td>\n" +
                            "<td>" + array[i].userId + "</td>\n" +
                            "<td>" + array[i].mark + "</td>\n" +
                            "</tr>\n");
                    }
                }

                console.log(shareHtml);
                totalPage=object.data.totalPages;
                // shareHtml+="<tr>" +
                //     "<td><a href='#' onclick='firstPage()'>首页</a></td>" +
                //     "<td><a href='#' onclick='previousPage()'>上一页</a></td>" +
                //     "<td>"+"第"+nowPage+"页/"+"第"+totalPage+"页"+"</td>" +
                //     "<td><a  href='#' onclick='nextPage()'>下一页</a></td>" +
                //     "<td><a  href='#' onclick='lastPage()'>末页</a></td>" +
                //     "</tr>"
                //shareContent为留出来填充内容的div的id名
                $("#shareContent").html(shareHtml);

            }
        })
    })
</script>
</body>
</html>